/**
 * Created by cheny on 2017/8/1.
 */
import React, { Component, PropTypes } from 'react'
import Chip from 'material-ui/Chip';
import Avatar from 'material-ui/Avatar';
import RaisedButton from 'material-ui/RaisedButton';
import TextField from 'material-ui/TextField';
import SvgIconFace from 'material-ui/svg-icons/action/face';
import injectTapEventPlugin from 'react-tap-event-plugin';
import SipClientManager from '../utils/SipClientManager';

const styles = {
    chip: {
        display: 'inline-block',
        margin: 4,
    },
    wrapper: {
        display: 'flex',
        flexWrap: 'wrap',
    },
};



export default class Home extends Component{

    constructor(props){
        super(props);
        this.handleCallTouchTap=this.handleCallTouchTap.bind(this);
        this.handleChipTouchTap=this.handleChipTouchTap.bind(this);
        let sipClient=new SipClientManager("sip:1000@10.0.0.32:5060","1000");
        this.sipClient=sipClient;
    }


    handleCallTouchTap() {
        alert('You clicked the Chip.');
        let text=document.getElementById("sip_call_username");
        if(text.value === null || text.value === undefined || text.value === ""){
            return;
        }

        this.sipClient.callOtherSip("sip:"+text.value+"@10.0.0.32:5060");
    }

    handleChipTouchTap() {
        // alert('You clicked the Chip.');

        this.sipClient.connectSip();
    }


    componentWillMount(){
        injectTapEventPlugin();
    }

    render() {

        return (
            <div>
                <Chip
                    onTouchTap={this.handleChipTouchTap}
                    style={styles.chip}
                ><Avatar color="#444" icon={<SvgIconFace />} />
                    FontIcon Avatar Chip
                </Chip>

                <TextField
                    id="sip_call_username"
                    style={styles.chip}
                    hintText="SIP URI For username"
                />
                <RaisedButton
                    type="Primary"
                    label="Call"
                    primary={true}
                    onTouchTap={this.handleCallTouchTap}
                />

            </div>
        )
    }

}